/**
 * Contact Info
 */

.contact-info {
    list-style-type: none;
    padding: 0;
    @include rem(margin-top, $unit/2);
    @include rem(margin-bottom, $unit/2);

    li {
        display: inline;
        @include rem(margin-right, $unit);
    }
}

.contact-info__general {
    li {
        display: block;
        @include rem(padding-left, $unit *1.875);

        & > span {
            color: $color1;
        }
    }
    li:not(:last-child) {
        @include rem(padding-bottom, $unit/2);
        @include rem(margin-bottom, $unit/2);
        border-bottom: 1px dotted $black;
    }
    a {
        color: $black;

        &:hover {
            color: $color1
        }
    }
}
@media screen and (max-width: $canvasMedium - 1) {
    .contact-info__general {
        @include rem(margin-left, $unit *3);
    }
}


.contact-info__phone {
    &:before {
        content: "\e00b";
        color: $color1;
        font-family: 'icomoon';
        font-style: normal;
        speak: none;
        font-weight: normal;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        @include rem(margin-left, $unit *-1.5); 
        @include rem(margin-right, $unit/2); 
        @include rem(font-size, $unit);
    }
}

.contact-info__email {
    &:before {
        content: "\e001";
        color: $color1;
        font-family: 'icomoon';
        font-style: normal;
        speak: none;
        font-weight: normal;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        @include rem(margin-left, $unit *-1.5); 
        @include rem(margin-right, $unit/2); 
        @include rem(font-size, $unit);
    }
}

.contact-info__social {
    @include rem(margin-left, $unit *3);

    ul {
        padding-left: 0;
    }
    a:hover {
        text-decoration: none;
    }
    i {
        @include transition();
        @include rem(font-size, 24);
        color: $black;
    }
    i:hover {
        color: $color1;
    }
}

@media screen and (max-width: $canvasMedium - 1) {
    .contact-info__general {
        li {
            display: block;
            @include rem(margin-top, $unit/2);
        }
    }
}


